<template>
    <div style="margin-left:20px;">
        <el-form ref="activityForm" :model="activityForm" :rules="rules" label-width="100px">
            <el-input v-model="activityForm.businessId" type="hidden"/>
            <el-input v-model="activityForm.activityType" type="hidden"/>
            <el-input v-model="activityForm.type" type="hidden"/>
            <div v-if="activityForm.type === 1">
                <el-form-item label="跟进方式" prop="category">
                    <el-select v-model="activityForm.category" placeholder="请选择跟进方式">
                        <el-option label="请选择跟进方式" value="" />
                        <el-option label="打电话" value="打电话" />
                        <el-option label="发邮件" value="发邮件" />
                        <el-option label="发短信" value="发短信" />
                        <el-option label="见面" value="见面" />
                        <el-option label="活动" value="活动" />
                    </el-select>
                </el-form-item>
                <el-form-item label="活动内容">
                    <editor v-model="activityForm.content" :min-height="192"/>
                </el-form-item>
                <el-row>
                    <el-col :span = "10">
                        <el-form-item :label="this.nextTimeTitle" prop="nextTime">
                            <el-date-picker
                                v-model="activityForm.nextTime"
                                type="datetime"
                                value-format = "yyyy-MM-dd HH:mm:ss"
                                placeholder="选择时间">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span = "10">
                        <el-form-item label="是否已拜访">
                            <el-select v-model="activityForm.status" placeholder="请选择跟进方式">
                                <el-option label="是" value=1 />
                                <el-option label="否" value=0 />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-form-item label="附件" prop="annex">
                    <fileUpload v-model="activityForm.annex"/>
                </el-form-item>
            </div>
            <div v-if="activityForm.type === 2">
                <el-form-item label="任务内容">
                    <editor v-model="activityForm.content" :min-height="192"/>
                </el-form-item>
                <el-row>
                    <el-col :span = "10">
                        <el-form-item label="负责人">
                            <el-select v-model="activityForm.activityLeader" placeholder="请选择负责人" filterable>
                                <el-option label="请选择负责人" value="" />
                                <el-option
                                v-for="dict1 in activityLeaders"
                                :key="dict1.userId"
                                :label="dict1.nickName"
                                :value="dict1.userId"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span = "10">
                        <el-form-item label="是否已完成">
                            <el-select v-model="activityForm.status" placeholder="请选择跟进方式">
                                <el-option label="是" value=1 />
                                <el-option label="否" value=0 />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-form-item label="附件" prop="annex">
                    <fileUpload v-model="activityForm.annex"/>
                </el-form-item>
            </div>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitForm">确 定</el-button>
            <el-button @click="cancel">取 消</el-button>
        </div>
    </div>
</template>

<script>
import { listActivity, getActivity, delActivity, addActivity, updateActivity, exportActivity } from "@/api/crm/activity/activity";
import { listadmin } from "@/api/system/user";
import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor';

export default {
    props: {
        businessId: "",
        activityType: "",
        activityFormEdit: "",
        isNewTime: "",
        isNewTimeUpdate: "",
        type: ""
    },
    name: "activityForm",
    components: {
        FileUpload,
        Editor
    },
    data() {
        return {
            // 活动表表格数据
            activityList: [],
            //表单
            activityForm: {},
            //下次联系时间-联系时间切换
            nextTimeTitle: "下次联系时间",
            //用户列表
            activityLeaders : [],
            // 表单校验
            rules: {
                
            }
        };
    },
    created() {
        listadmin().then(response => {
            this.activityLeaders = response.data;
        });
    },
    methods: {
        // 表单重置
        reset() {
            this.activityForm = {
                id: null,
                type: null,
                category: null,
                activityType: null,
                businessId: null,
                content: null,
                activityLeader: null,
                nextTime: null,
                status: 0,
                lng: null,
                lat: null,
                address: null,
                annex: null,
                createBy: null,
                createTime: null,
                updateBy: null,
                updateTime: null,
                remark: null
            };
            this.resetForm("activityForm");
        },
        // 取消按钮
        cancel() {
            this.$emit('activityFormClose');
        },
        /** 提交按钮 */
        submitForm() {
            this.$refs["activityForm"].validate(valid => {
                if (valid) {
                    if (this.activityForm.id != null) {
                        updateActivity(this.activityForm).then(response => {
                            this.msgSuccess("修改成功");
                            this.$emit('activityFormClose');
                            this.$emit('getListActivity');
                        });
                    } else {
                        addActivity(this.activityForm).then(response => {
                            this.msgSuccess("新增成功");
                            this.$emit('activityFormClose');
                            this.$emit('getListActivity');
                        });
                    }
                }
            });
        }
    },
    watch: {
        //新增
        isNewTime: {
        　　handler(newValue, oldValue) {
        　　    this.reset();
                this.nextTimeTitle = "下次联系时间";
                this.activityForm.type = this.type;
                this.activityForm.businessId = this.businessId;
                this.activityForm.activityType = this.activityType;
                this.activityForm.status="0";
                //新增时，默认当前任务负责人是登录账号
                this.activityForm.activityLeader = this.$store.state.user.userid;
        　　},
            deep: true,
        　　immediate: true
        },
        //修改
        isNewTimeUpdate: {
        　　handler(newForm, oldForm) {
        　　    if(null != this.activityFormEdit.id){
                    this.activityForm = this.activityFormEdit;
                    this.nextTimeTitle = "联系时间";
                    this.activityForm.status="" + this.activityForm.status;
                }
        　　},
            deep: true,
        　　immediate: true
        }
    } 
};
</script>